import Sprite from '../base/sprite'
import store from '../../store/index'
import Spcies from './spcies'
import pua from './pua'
import { extendClass } from "../../utils/index"
import { screenWidth, screenHeight, DIRECTION_LEFT, DIRECTION_RIGHT, DIRECTION_TOP, DIRECTION_BOTTOM, SPCIES_TYPE } from '../../constant/index'
import { calculateAdjacentSide, calculateOppositeSide } from '../../utils/index'
import { getCloudUrl } from '../../utils'

const MAX_ROTATE = 50 // 最大旋转角度
const MIX_ROTATE = -50 // 最大旋转角度

const CARD_IMG_SRC = getCloudUrl('images/shenzhi.png')
const CARD_WIDTH = 15
const CARD_HEIGHT = 442 / 2
/**
 * 挂金币位移
 */
const CARD_MOVE = 1

/**
* 创建实例
*/
const createdEntity = (percentage = 50) => {
  const number = Math.floor(Math.random() * 100)
  let type = SPCIES_TYPE.BOMB.type
  let entity = pua
  let key = 'pua'
  if (number < percentage) {
    type = SPCIES_TYPE.GOLD.type
    entity = Spcies,
    key = 'spcies'
  }
  const item = new entity()
  item.type = type
  return item
}
/**
 * 绳子类
 */
export default class Cord extends Sprite {
  /**
   * 旋转角度
   */
  rotate = 0
  /**
   * 移动方向
   */
  direction = DIRECTION_LEFT 
  /**
   * 旋转速度
   */
  speedRotate = 0.7
  /**
   * 绳子顶点坐标
   */
  vertex = {
    x: 0,
    y: 0
  }
  /**
   * 挂在绳子上的金币
   */
  gold = null
  constructor() {
    super(CARD_IMG_SRC, CARD_WIDTH, CARD_HEIGHT)
    /**
     * 高度
     */
    const height = screenHeight * (1 / 4)
    const raito = height / CARD_HEIGHT
    this.height = CARD_HEIGHT * raito
    this.width = CARD_WIDTH * raito

    // 玩家默认处于屏幕底部居中位置
    this.x = screenWidth / 2 - this.width / 2

    /**
     * y坐标
     */
    this.y = -20
    /**
     * 移动速度
     */
    this.speed = 1
    /**
     * 移动距离
     */
    this.moveNumber = 0
    /**
     * 移动方向
     */
    this.moveDirection = DIRECTION_TOP
    /**
     * 是否移动
     */
    this.isMove = false
    /**
     * 是否挂载的有金币
     */
    this.isGoods = false
    /**
     * 点击回调
     */
    this.clickFn = () => ({})
    /**
     * 设置数据更新函数
     */
    extendClass(this)

    // 初始化事件监听
    this.updateVertex()
    this.creatdSpecies()
  }
  onLoad () {
  }
  initSize() {
    this.x = screenWidth / 2 - this.width / 2
    this.height = screenHeight * (1 / 4)
    this.y = -20
  }
  clickCallBack (fn) {
    this.clickFn = fn
  }
  touchend (e) {
    this.gold.setIsFall(true)
    this.gold.setFallAngle(this.rotate)
    if (!this.gold.direction) {
      this.gold.setDirection(this.direction)
    }
    store.moveGolds.push(this.gold)
    this.setIsGoods(false)
    this.clickFn(e)
  }
  /**
   * 创建金币
   */
  creatdSpecies() {
    this.gold = createdEntity(90)
    this.gold.init(
      this.vertex.x - this.gold.width / 2,
      this.vertex.y - this.gold.height / 2,
      3
    )
    this.setIsGoods(true)
    store.golds.push(this.gold)
  }
  /**
   * 开始移动
   */
  startMove () {
    this.setIsMove(true)
    this.setMoveDirection(DIRECTION_TOP)
  }
  /**
   * 每一帧更新旋转角度
   */
  update() {
    this.moveRotate()
    this.moveUpAndDowm()
    this.updateVertex()
    this.setGoldPosition()
  }
  /**
   * 设置金币位置
   */
  setGoldPosition() {
    // 如果金币还挂在绳子上
    if (!this.gold.isFall) {
      this.gold.setPosition({
        x: this.vertex.x - this.gold.width / 2,
        y: this.vertex.y - this.gold.height / 2
      })
      this.gold.setRotate(this.rotate)
    }
  }
  /**
   * 控制移动角度
   */
  moveRotate() {
    // 角度大于最大角度，设置方向为向左, 向左是增加角度，向右是减少角度
    if (this.rotate >= (MAX_ROTATE)) {
      this.setDirection(DIRECTION_RIGHT)
    }
    // 角度小于最小角度，设置方向为向右
    if (this.rotate <= (MIX_ROTATE)) {
      this.setDirection(DIRECTION_LEFT)
    }
    // 如果方向为向左，角度减去速度
    if (this.direction === DIRECTION_LEFT) {
      this.setRotate(this.rotate + this.speedRotate)
    }
    // 如果方向为向右，角度加上速度
    if (this.direction === DIRECTION_RIGHT) {
      this.setRotate(this.rotate - this.speedRotate)
    }
  }
  /**
   * 控制移动上下
   */
  moveUpAndDowm() {
    if (this.isMove) {
      if (this.moveDirection === DIRECTION_TOP) {
        this.setMoveNumber(this.moveNumber + this.speed)
        this.setY(this.y - (this.speed))
        if (this.moveNumber >= CARD_MOVE) {
          this.setMoveDirection(DIRECTION_BOTTOM)
          this.creatdSpecies()
        }
      } else if (this.moveDirection === DIRECTION_BOTTOM) {
        this.setMoveNumber(this.moveNumber - this.speed / 2)
        this.setY(this.y + (this.speed / 2))
        if (this.moveNumber <= 0) {
          this.setMoveNumber(0)
          this.setIsMove(false)
          this.setMoveDirection('')
          this.initSize()
        }
      }
    }
  }
  /**
   * 根据角度计算对边
   */
  updateVertex () {
    this.vertex.y = calculateAdjacentSide(this.height, this.rotate) - (Math.abs(this.y)) - this.moveNumber - 20
    this.vertex.x = (screenWidth / 2) - calculateOppositeSide(this.height - (Math.abs(this.y)) - this.moveNumber, this.rotate)
  }
  /**
   * 将精灵图绘制在canvas上
   */
  render(ctx) {
    // 保存当前状态  
    ctx.save()
    ctx.translate((screenWidth - (this.x + this.width / 2) - 5), this.y)
    ctx.rotate(this.rotate * Math.PI / 180)
    ctx.drawImage(
      this.img,
      0,
      this.y,
      this.width,
      this.height
    )
    ctx.restore()
  }
}
